<div id="pe-productabs" class="peproductabs_top"><!-- style="width: {$fullWidth}px"--> 
	<ul id="tabs" class="tabs tab-headers"> 
		{if in_array('1', $tabNames, true)}
			<li><a href="#content-wrap-1">Sản phẩm mới</a></li> 
		{/if}
		{if in_array('2', $tabNames, true)}
			<li><a href="#content-wrap-2">Hàng độc</a></li>
		{/if}
		{if in_array('3', $tabNames, true)}
			<li><a href="#content-wrap-3">Sản phẩm nổi bật</a></li> 
		{/if}
		{if in_array('4', $tabNames, true)}
			<li><a href="#content-wrap-4">Sản phẩm bán chạy</a></li> 
		{/if}
	</ul> 
	
	{if in_array('1', $tabNames, true)}	
		<div id="content-wrap-1" class="petabscontent">
		  <ul id="newproduct_list" class="clear tab_product_list">
						
				{foreach from=$newproducts item=product name=NewProductsTabs}
					<li class="ajax_block_product {if $smarty.foreach.products.first}first_item{elseif $smarty.foreach.products.last}last_item{/if} {if $smarty.foreach.products.index % 2}alternate_item{else}item{/if} clearfix">
						<div class="left_block">
							{if isset($comparator_max_item) && $comparator_max_item}
								<p class="compare">
									<input type="checkbox" class="comparator" id="comparator_item_{$product.id_product}" value="comparator_item_{$product.id_product}" {if isset($compareProducts) && in_array($product.id_product, $compareProducts)}checked="checked"{/if} /> 
									<label for="comparator_item_{$product.id_product}">{l s='Select to compare'}</label>
								</p>
							{/if}
						</div>
						<div class="center_block">
							<a href="{$product.link|escape:'htmlall':'UTF-8'}" class="product_img_link" title="{$product.name|escape:'htmlall':'UTF-8'}">
								<img src="{$link->getImageLink($product.link_rewrite, $product.id_image, 'home_default')}" alt="{$product.legend|escape:'htmlall':'UTF-8'}" {if isset($homeSize)} width="{$homeSize.width}" height="{$homeSize.height}"{/if} />
								<!--{if isset($product.new) && $product.new == 1}<span class="new">{l s='Mới'}</span>{/if}-->
								<span class="new">{l s='Mới'}</span>
							</a>
							<h3><a href="{$product.link|escape:'htmlall':'UTF-8'}" title="{$product.name|escape:'htmlall':'UTF-8'}">{$product.name|escape:'htmlall':'UTF-8'|truncate:35:'...'}</a></h3>
							<p class="product_desc"><a href="{$product.link|escape:'htmlall':'UTF-8'}" title="{$product.description_short|strip_tags:'UTF-8'|truncate:360:'...'}" >{$product.description_short|strip_tags:'UTF-8'|truncate:360:'...'}</a></p>
						</div>
						<div class="right_block">
							{if isset($product.on_sale) && $product.on_sale && isset($product.show_price) && $product.show_price && !$PS_CATALOG_MODE}<span class="on_sale">{l s='On sale!'}</span>
							{elseif isset($product.reduction) && $product.reduction && isset($product.show_price) && $product.show_price && !$PS_CATALOG_MODE}<span class="discount">{l s='Giá khuyến mãi!'}</span>{/if}
							{if (!$PS_CATALOG_MODE AND ((isset($product.show_price) && $product.show_price) || (isset($product.available_for_order) && $product.available_for_order)))}
							<div class="content_price">
								{if isset($product.show_price) && $product.show_price && !isset($restricted_country_mode)}<span class="price" style="display: inline;">{if !$priceDisplay}{convertPrice price=$product.price}{else}{convertPrice price=$product.price_tax_exc}{/if}</span><br />{/if}
								{if isset($product.available_for_order) && $product.available_for_order && !isset($restricted_country_mode)}<span class="availability">{if ($product.allow_oosp || $product.quantity > 0)}{l s='Available'}{elseif (isset($product.quantity_all_versions) && $product.quantity_all_versions > 0)}{l s='Product available with different options'}{else}{l s='Out of stock'}{/if}</span>{/if}
							</div>
							<!--{if isset($product.online_only) && $product.online_only}<span class="online_only">{l s='Chỉ bán online!'}</span>{/if}-->
							{/if}
							{if ($product.id_product_attribute == 0 || (isset($add_prod_display) && ($add_prod_display == 1))) && $product.available_for_order && !isset($restricted_country_mode) && $product.minimal_quantity <= 1 && $product.customizable != 2 && !$PS_CATALOG_MODE}
								{if ($product.allow_oosp || $product.quantity > 0)}
									{if isset($static_token)}
										<a class="button ajax_add_to_cart_button exclusive" rel="ajax_id_product_{$product.id_product|intval}" href="{$link->getPageLink('cart',false, NULL, "add&amp;id_product={$product.id_product|intval}&amp;token={$static_token}", false)}" title="{l s='Thêm vào giỏ'}"><span></span>{l s='Thêm vào giỏ'}</a>
									{else}
										<a class="button ajax_add_to_cart_button exclusive" rel="ajax_id_product_{$product.id_product|intval}" href="{$link->getPageLink('cart',false, NULL, "add&amp;id_product={$product.id_product|intval}", false)} title="{l s='Thêm vào giỏ'}"><span></span>{l s='Thêm vào giỏ'}</a>
									{/if}						
								{else}
									<span class="exclusive"><span></span>{l s='Thêm vào giỏ'}</span><br />
								{/if}
							{/if}
							<a class="button lnk_view" href="{$product.link|escape:'htmlall':'UTF-8'}" title="{l s='View'}">{l s='View'}</a>
						</div>
					</li>
				{/foreach}
			</ul><!-- #content_tabs -->
				<div class="clearfix"></div>
				<a class="prev" href="javascript:;"></a>
				<a class="next" href="javascript:;"></a>
				<div class="pagination pager" id="pagination1"></div>
		</div>
	{/if}
	
	{if in_array('2', $tabNames, true)}	
		<div id="content-wrap-2" class="petabscontent">
		  <ul id="specialproduct_list" class="clear tab_product_list">
						
				{foreach from=$specialProduct item=product name=SpecialProductTabs}
					<li class="ajax_block_product {if $smarty.foreach.products.first}first_item{elseif $smarty.foreach.products.last}last_item{/if} {if $smarty.foreach.products.index % 2}alternate_item{else}item{/if} clearfix">
						<div class="left_block">
							{if isset($comparator_max_item) && $comparator_max_item}
								<p class="compare">
									<input type="checkbox" class="comparator" id="comparator_item_{$product.id_product}" value="comparator_item_{$product.id_product}" {if isset($compareProducts) && in_array($product.id_product, $compareProducts)}checked="checked"{/if} /> 
									<label for="comparator_item_{$product.id_product}">{l s='Select to compare'}</label>
								</p>
							{/if}
						</div>
						<div class="center_block">
							<a href="{$product.link|escape:'htmlall':'UTF-8'}" class="product_img_link" title="{$product.name|escape:'htmlall':'UTF-8'}">
								<img src="{$link->getImageLink($product.link_rewrite, $product.id_image, 'home_default')}" alt="{$product.legend|escape:'htmlall':'UTF-8'}" {if isset($homeSize)} width="{$homeSize.width}" height="{$homeSize.height}"{/if} />
								{if isset($product.new) && $product.new == 1}<span class="new">{l s='Mới'}</span>{/if}
							</a>
							<h3><a href="{$product.link|escape:'htmlall':'UTF-8'}" title="{$product.name|escape:'htmlall':'UTF-8'}">{$product.name|escape:'htmlall':'UTF-8'|truncate:35:'...'}</a></h3>
							<p class="product_desc"><a href="{$product.link|escape:'htmlall':'UTF-8'}" title="{$product.description_short|strip_tags:'UTF-8'|truncate:360:'...'}" >{$product.description_short|strip_tags:'UTF-8'|truncate:360:'...'}</a></p>
						</div>
						<div class="right_block">
							{if isset($product.on_sale) && $product.on_sale && isset($product.show_price) && $product.show_price && !$PS_CATALOG_MODE}<span class="on_sale">{l s='On sale!'}</span>
							{elseif isset($product.reduction) && $product.reduction && isset($product.show_price) && $product.show_price && !$PS_CATALOG_MODE}<span class="discount">{l s='Giá khuyến mãi!'}</span>{/if}
							{if (!$PS_CATALOG_MODE AND ((isset($product.show_price) && $product.show_price) || (isset($product.available_for_order) && $product.available_for_order)))}
							<div class="content_price">
								{if isset($product.show_price) && $product.show_price && !isset($restricted_country_mode)}<span class="price" style="display: inline;">{if !$priceDisplay}{convertPrice price=$product.price}{else}{convertPrice price=$product.price_tax_exc}{/if}</span><br />{/if}
								{if isset($product.available_for_order) && $product.available_for_order && !isset($restricted_country_mode)}<span class="availability">{if ($product.allow_oosp || $product.quantity > 0)}{l s='Available'}{elseif (isset($product.quantity_all_versions) && $product.quantity_all_versions > 0)}{l s='Product available with different options'}{else}{l s='Out of stock'}{/if}</span>{/if}
							</div>
							<!--{if isset($product.online_only) && $product.online_only}<span class="online_only">{l s='Chỉ bán online!'}</span>{/if}-->
							{/if}
							{if ($product.id_product_attribute == 0 || (isset($add_prod_display) && ($add_prod_display == 1))) && $product.available_for_order && !isset($restricted_country_mode) && $product.minimal_quantity <= 1 && $product.customizable != 2 && !$PS_CATALOG_MODE}
								{if ($product.allow_oosp || $product.quantity > 0)}
									{if isset($static_token)}
										<a class="button ajax_add_to_cart_button exclusive" rel="ajax_id_product_{$product.id_product|intval}" href="{$link->getPageLink('cart',false, NULL, "add&amp;id_product={$product.id_product|intval}&amp;token={$static_token}", false)}" title="{l s='Thêm vào giỏ'}"><span></span>{l s='Thêm vào giỏ'}</a>
									{else}
										<a class="button ajax_add_to_cart_button exclusive" rel="ajax_id_product_{$product.id_product|intval}" href="{$link->getPageLink('cart',false, NULL, "add&amp;id_product={$product.id_product|intval}", false)} title="{l s='Thêm vào giỏ'}"><span></span>{l s='Thêm vào giỏ'}</a>
									{/if}						
								{else}
									<span class="exclusive"><span></span>{l s='Thêm vào giỏ'}</span><br />
								{/if}
							{/if}
							<a class="button lnk_view" href="{$product.link|escape:'htmlall':'UTF-8'}" title="{l s='View'}">{l s='View'}</a>
						</div>
					</li>
				{/foreach}
			</ul><!-- #content_tabs -->
				<div class="clearfix"></div>
				<a class="prev" href="javascript:;"></a>
				<a class="next" href="javascript:;"></a>
				<div class="pagination pager" id="pagination2"></div>
		</div>
	{/if}
	
	{if in_array('3', $tabNames, true)}	
		<div id="content-wrap-3" class="petabscontent">
		  <ul id="featureproduct_list" class="clear tab_product_list">		
						
				{foreach from=$featureProduct item=product name=FeatureProductTabs}
					<li class="ajax_block_product {if $smarty.foreach.products.first}first_item{elseif $smarty.foreach.products.last}last_item{/if} {if $smarty.foreach.products.index % 2}alternate_item{else}item{/if} clearfix">
						<div class="left_block">
							{if isset($comparator_max_item) && $comparator_max_item}
								<p class="compare">
									<input type="checkbox" class="comparator" id="comparator_item_{$product.id_product}" value="comparator_item_{$product.id_product}" {if isset($compareProducts) && in_array($product.id_product, $compareProducts)}checked="checked"{/if} /> 
									<label for="comparator_item_{$product.id_product}">{l s='Select to compare'}</label>
								</p>
							{/if}
						</div>
						<div class="center_block">
							<a href="{$product.link|escape:'htmlall':'UTF-8'}" class="product_img_link" title="{$product.name|escape:'htmlall':'UTF-8'}">
								<img src="{$link->getImageLink($product.link_rewrite, $product.id_image, 'home_default')}" alt="{$product.legend|escape:'htmlall':'UTF-8'}" {if isset($homeSize)} width="{$homeSize.width}" height="{$homeSize.height}"{/if} />
								{if isset($product.new) && $product.new == 1}<span class="new">{l s='Mới'}</span>{/if}
							</a>
							<h3><a href="{$product.link|escape:'htmlall':'UTF-8'}" title="{$product.name|escape:'htmlall':'UTF-8'}">{$product.name|escape:'htmlall':'UTF-8'|truncate:35:'...'}</a></h3>
							<p class="product_desc"><a href="{$product.link|escape:'htmlall':'UTF-8'}" title="{$product.description_short|strip_tags:'UTF-8'|truncate:360:'...'}" >{$product.description_short|strip_tags:'UTF-8'|truncate:360:'...'}</a></p>
						</div>
						<div class="right_block">
							{if isset($product.on_sale) && $product.on_sale && isset($product.show_price) && $product.show_price && !$PS_CATALOG_MODE}<span class="on_sale">{l s='On sale!'}</span>
							{elseif isset($product.reduction) && $product.reduction && isset($product.show_price) && $product.show_price && !$PS_CATALOG_MODE}<span class="discount">{l s='Giá khuyến mãi!'}</span>{/if}
							{if (!$PS_CATALOG_MODE AND ((isset($product.show_price) && $product.show_price) || (isset($product.available_for_order) && $product.available_for_order)))}
							<div class="content_price">
								{if isset($product.show_price) && $product.show_price && !isset($restricted_country_mode)}<span class="price" style="display: inline;">{if !$priceDisplay}{convertPrice price=$product.price}{else}{convertPrice price=$product.price_tax_exc}{/if}</span><br />{/if}
								{if isset($product.available_for_order) && $product.available_for_order && !isset($restricted_country_mode)}<span class="availability">{if ($product.allow_oosp || $product.quantity > 0)}{l s='Available'}{elseif (isset($product.quantity_all_versions) && $product.quantity_all_versions > 0)}{l s='Product available with different options'}{else}{l s='Out of stock'}{/if}</span>{/if}
							</div>
							<!--{if isset($product.online_only) && $product.online_only}<span class="online_only">{l s='Chỉ bán online!'}</span>{/if}-->
							{/if}
							{if ($product.id_product_attribute == 0 || (isset($add_prod_display) && ($add_prod_display == 1))) && $product.available_for_order && !isset($restricted_country_mode) && $product.minimal_quantity <= 1 && $product.customizable != 2 && !$PS_CATALOG_MODE}
								{if ($product.allow_oosp || $product.quantity > 0)}
									{if isset($static_token)}
										<a class="button ajax_add_to_cart_button exclusive" rel="ajax_id_product_{$product.id_product|intval}" href="{$link->getPageLink('cart',false, NULL, "add&amp;id_product={$product.id_product|intval}&amp;token={$static_token}", false)}" title="{l s='Thêm vào giỏ'}"><span></span>{l s='Thêm vào giỏ'}</a>
									{else}
										<a class="button ajax_add_to_cart_button exclusive" rel="ajax_id_product_{$product.id_product|intval}" href="{$link->getPageLink('cart',false, NULL, "add&amp;id_product={$product.id_product|intval}", false)} title="{l s='Thêm vào giỏ'}"><span></span>{l s='Thêm vào giỏ'}</a>
									{/if}						
								{else}
									<span class="exclusive"><span></span>{l s='Thêm vào giỏ'}</span><br />
								{/if}
							{/if}
							<a class="button lnk_view" href="{$product.link|escape:'htmlall':'UTF-8'}" title="{l s='View'}">{l s='View'}</a>
						</div>
					</li>
				{/foreach}
			</ul><!-- #content_tabs -->
				<div class="clearfix"></div>
				<a class="prev" href="javascript:;"></a>
				<a class="next" href="javascript:;"></a>
				<div class="pagination pager" id="pagination3"></div>
		</div>
	{/if}
	
	{if in_array('4', $tabNames, true)}	
		<div id="content-wrap-4" class="petabscontent">
		  <ul id="bestsellersproduct_list" class="clear tab_product_list">		
						
				{foreach from=$bestSellers item=product name=BestSellersProductTabs}
					<li class="ajax_block_product {if $smarty.foreach.products.first}first_item{elseif $smarty.foreach.products.last}last_item{/if} {if $smarty.foreach.products.index % 2}alternate_item{else}item{/if} clearfix">
						<div class="left_block">
							{if isset($comparator_max_item) && $comparator_max_item}
								<p class="compare">
									<input type="checkbox" class="comparator" id="comparator_item_{$product.id_product}" value="comparator_item_{$product.id_product}" {if isset($compareProducts) && in_array($product.id_product, $compareProducts)}checked="checked"{/if} /> 
									<label for="comparator_item_{$product.id_product}">{l s='Select to compare'}</label>
								</p>
							{/if}
						</div>
						<div class="center_block">
							<a href="{$product.link|escape:'htmlall':'UTF-8'}" class="product_img_link" title="{$product.name|escape:'htmlall':'UTF-8'}">
								<img src="{$link->getImageLink($product.link_rewrite, $product.id_image, 'home_default')}" alt="{$product.legend|escape:'htmlall':'UTF-8'}" {if isset($homeSize)} width="{$homeSize.width}" height="{$homeSize.height}"{/if} />
								{if isset($product.new) && $product.new == 1}<span class="new">{l s='Mới'}</span>{/if}
							</a>
							<h3><a href="{$product.link|escape:'htmlall':'UTF-8'}" title="{$product.name|escape:'htmlall':'UTF-8'}">{$product.name|escape:'htmlall':'UTF-8'|truncate:35:'...'}</a></h3>
							<p class="product_desc"><a href="{$product.link|escape:'htmlall':'UTF-8'}" title="{$product.description_short|strip_tags:'UTF-8'|truncate:360:'...'}" >{$product.description_short|strip_tags:'UTF-8'|truncate:360:'...'}</a></p>
						</div>
						<div class="right_block">
							{if isset($product.on_sale) && $product.on_sale && isset($product.show_price) && $product.show_price && !$PS_CATALOG_MODE}<span class="on_sale">{l s='On sale!'}</span>
							{elseif isset($product.reduction) && $product.reduction && isset($product.show_price) && $product.show_price && !$PS_CATALOG_MODE}<span class="discount">{l s='Giá khuyến mãi!'}</span>{/if}
							{if (!$PS_CATALOG_MODE AND ((isset($product.show_price) && $product.show_price) || (isset($product.available_for_order) && $product.available_for_order)))}
							<div class="content_price">
								{if isset($product.show_price) && $product.show_price && !isset($restricted_country_mode)}<span class="price" style="display: inline;">{if !$priceDisplay}{convertPrice price=$product.price}{else}{convertPrice price=$product.price_tax_exc}{/if}</span><br />{/if}
								{if isset($product.available_for_order) && $product.available_for_order && !isset($restricted_country_mode)}<span class="availability">{if ($product.allow_oosp || $product.quantity > 0)}{l s='Available'}{elseif (isset($product.quantity_all_versions) && $product.quantity_all_versions > 0)}{l s='Product available with different options'}{else}{l s='Out of stock'}{/if}</span>{/if}
							</div>
							<!--{if isset($product.online_only) && $product.online_only}<span class="online_only">{l s='Chỉ bán online!'}</span>{/if}-->
							{/if}
							{if ($product.id_product_attribute == 0 || (isset($add_prod_display) && ($add_prod_display == 1))) && $product.available_for_order && !isset($restricted_country_mode) && $product.minimal_quantity <= 1 && $product.customizable != 2 && !$PS_CATALOG_MODE}
								{if ($product.allow_oosp || $product.quantity > 0)}
									{if isset($static_token)}
										<a class="button ajax_add_to_cart_button exclusive" rel="ajax_id_product_{$product.id_product|intval}" href="{$link->getPageLink('cart',false, NULL, "add&amp;id_product={$product.id_product|intval}&amp;token={$static_token}", false)}" title="{l s='Thêm vào giỏ'}"><span></span>{l s='Thêm vào giỏ'}</a>
									{else}
										<a class="button ajax_add_to_cart_button exclusive" rel="ajax_id_product_{$product.id_product|intval}" href="{$link->getPageLink('cart',false, NULL, "add&amp;id_product={$product.id_product|intval}", false)} title="{l s='Thêm vào giỏ'}"><span></span>{l s='Thêm vào giỏ'}</a>
									{/if}						
								{else}
									<span class="exclusive"><span></span>{l s='Thêm vào giỏ'}</span><br />
								{/if}
							{/if}
							<a class="button lnk_view" href="{$product.link|escape:'htmlall':'UTF-8'}" title="{l s='View'}">{l s='View'}</a>
						</div>
					</li>
				{/foreach}
			</ul><!-- #content_tabs -->
				<div class="clearfix"></div>
				<a class="prev" href="javascript:;"></a>
				<a class="next" href="javascript:;"></a>
				<div class="pagination pager" id="pagination4"></div>
		</div>
	{/if}
	
</div> 
<script type="text/javascript"> 


/*
		//width: "variable",
			width: 680,
			height: 320,
			items: {
				visible: 4,
				minimum: 4,
				width: 160,
				height: 320
			},
			scroll: {
				items: 1,
				//fx: "fade"
			},
			
	 */

$(document).ready(function(){
	 $("#newproduct_list").carouFredSel({	 
			items       : 4,
			//circular: false,
			infinite: false,
			auto 	: false,
			pagination	: '#pagination1',
			width: 680,		
			prev: '#content-wrap-1 .prev',
			next: '#content-wrap-1  .next',
			height : "100%"
		}); 
	 $("#specialproduct_list").carouFredSel({
			items       : 4,
			//circular: false,
			infinite: false,
			auto 	: false,
			pagination	: '#pagination2',
			width: 680,
			prev: '#content-wrap-2 .prev',
			next: '#content-wrap-2 .next',
			height : "100%"
		});
	  $("#featureproduct_list").carouFredSel({
			items       : 4,
			//circular: false,
			infinite: false,
			auto 	: false,
			pagination	: '#pagination3',
			width: 680,
			prev: '#content-wrap-3 .prev',
			next: '#content-wrap-3  .next',
			height : "100%"
		});	
		$("#bestsellersproduct_list").carouFredSel({
			items       : 4,
			//circular: false,
			infinite: false,
			auto 	: false,
			pagination	: '#pagination4',
			width: 680,
			prev: '#content-wrap-4 .prev',
			next: '#content-wrap-4 .next',
			height : "100%"
		});
		
		var tabContainers = $("div#pe-productabs div.petabscontent");
		tabContainers.hide().filter(":first").show();
		
		$("div#pe-productabs ul.tabs a").click(function () {
			tabContainers.hide();
			tabContainers.filter(this.hash).show();
			$("div#pe-productabs ul.tabs a").removeClass("selected");
			$(this).addClass("selected");
			return false;
		}).filter(":first").click();
});

			
		
</script>